<template>
	<view class="page">
		<!-- 头部背景 -->
		<view class="head-bg">
			<view class="head-user">
				<view class="user">
					<image :src="userInfo.avatar" mode=""></image>
					<text>{{userInfo.username}}</text>
				</view>
				<view class="exchange" @click="onExchangeRecord">
					<text>兑换记录</text>
					<text class="iconfont icon-more"></text>
				</view>
			</view>
			<view class="integral-balance">
				<view class="integral" @click="onIntegral">
					<text>当前可用积分</text>
					<text class="number">{{userInfo.integral}}</text>
				</view>
			</view>
			<view class="bg">
				<image src="/static/integral_bg1.png" mode=""></image>
			</view>
		</view>
		<!-- 优惠券兑换专区 -->
		<!-- <view class="coupon-exchange">
			<view class="exchange-title">
				<view class="title">优惠券兑换</view>
			</view>
			<view class="coupon-list">
				<view class="list" v-for="(item,index) in 1"
					@click="onExchange(0)"
					:key="index">
					<view class="thumb">
						<image src="" mode=""></image>
					</view>
					<view class="title">10元直减优惠券</view>
					<view class="integral">1000积分</view>
				</view>
			</view>
		</view> -->
		<!-- 精选积分兑换 -->
		<view class="handpick-exchange">
			<view class="exchange-title">
				<view class="title">精选兑换</view>
			</view>
			<view class="handpick-list">
				<view class="list" v-for="(item,index) in exchangeGoodsList"
				@click="onExchange(1,item.id)"
				:key="index">
					<view class="thumb">
						<image :src="item.getGoodsSkuInfo.sku_image" mode=""></image>
					</view>
					<view class="title">
						<text class="two-omit">{{item.getGoodsInfo.goods_name}}</text>
					</view>
					<view class="price-integral">
						<text class="integral">{{item.need_integral}}积分</text>
						<text class="price">￥{{item.getGoodsSkuInfo.sku_price}}</text>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:[],
				exchangeGoodsList:[]
			};
		},
		methods:{
			/**
			 * 兑换点击
			 * @param {Number} 
			 */
			onExchange(type,id){
				uni.navigateTo({
					url: '/pages/ExchangeDetails/ExchangeDetails?id=' + id + "&type=" + type,
				})
			},
			/**
			 * 兑换记录
			 */
			onExchangeRecord(){
				uni.navigateTo({
					url: '/pages/ExchangeRecord/ExchangeRecord',
				})
			},
			/**
			 * 积分点击
			 */
			onIntegral(){
				uni.navigateTo({
					url: '/pages/IntegralRecord/IntegralRecord'
				})
			},
		
		},
		onReady() {
			this.userInfo = uni.getStorageSync('userInfo')
			this.$http.get('exchangeGoodsList', {
			}).then(res => {
				this.exchangeGoodsList = res.data.data
			})
		}
	}
</script>

<style scoped lang="scss">
	@import 'IntegralDetails.scss';
</style>
